<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>首页</title>
		<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
		<link rel="stylesheet" type="text/css" href="Css/one.css">
		<link rel="stylesheet" type="text/css" href="Css/toplogo.css">
		<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1632750_204xwxiwzht.css?1583918713" />
		<script src="Js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div class="body_con">
			<div id="s-left">
				<div id="logo">
					<ul>
						<li>
							<div class="img-logo">
								<img src="img/logo.png" alt="量子科技" />
							</div>
							<div class="yonghu">
								<a href="">退出</a>
								<a href="">量子矩阵</a>
							</div>
						</li>
					</ul>
				</div>
				<div class="body_left">
					<ul class="body_left_list">
						<li>
							<label>
			                    <span>首页</span>
			                    <!--<i class="iconfont iconxiajiantou"></i>-->
			                    <a href="首页.html"></a>
                			</label>
						</li>
						<li>
							<label>
			                    <span>院校管理</span>
			                    <!--<i class="iconfont iconxiajiantou"></i>-->
			                    <a href="院校管理.html"></a>
		                	</label>
						</li>
						<li>
							<label>
			                    <span>学生管理</span>
			                    <!--<i class="iconfont iconxiajiantou"></i>-->
			                    <a href="qtoma/student.html"></a>
		                	</label>
						</li>
						<li>
							<label>
			                    <span>业绩管理</span>
			                    <!--<i class="iconfont iconxiajiantou"></i>-->
			                    <a href="业绩管理.html"></a>
		                	</label>
						</li>
						<li class="performance">
							<label>
			                    <span>数据管理</span>
			                    <i class="iconfont iconxiajiantou"></i>
			                    <a href="#"></a>
		                	</label>
							<ul>
								<li>
									<label>
					                    <span>市场统计</span>
					                    <a href="市场统计.html"></a>
				                	</label>
								</li>
								<li>
									<label>
					                    <span>口碑统计</span>
					                    <a href="口碑统计.html"></a>
				                	</label>
								</li>
								<li>
									<label>
					                    <span>就业统计</span>
					                    <a href="就业统计.html"></a>
				                	</label>
								</li>
								<li>
									<label>
					                    <span>就业率统计</span>
					                    <a href="就业率统计.html"></a>
				                	</label>
								</li>
							</ul>
						</li>
						<li class="warn">
							<label>
	                    <span>提醒功能</span>
	                    <!--<i class="iconfont iconxiajiantou"></i>-->
	                    <a href="提心事项.html"></a>
                	</label>
						</li>
					</ul>
				</div>
				<div class="body_right">
					<div class="body-topa">
						<span>
							首页
						</span>
					</div>
					<div class="Quick-query">
						<h3>快捷方式</h3>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面一</span>
						</div>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面二</span>
						</div>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面三</span>
						</div>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面四</span>
						</div>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面五</span>
						</div>
						<div class="Quick-query-hm">
							<h3></h3>
							<span>页面六</span>
						</div>
					</div>
					<div class="backlog">
						<h3>待办事项</h3>
						<div class="backlogA">
							<h4>学生管理</h4>
							<span>
								66
							</span>
						</div>
						<div class="backlogA">
							<h4>学校管理</h4>
							<span>
								166
							</span>
						</div>
						<div class="backlogA">
							<h4>嘿嘿嘿</h4>
							<span>
								666
							</span>
						</div>
						<div class="backlogA">
							<h4>一giao我里giao</h4>
							<span>
								66666
							</span>
						</div>
					</div>
					<div class="Data-browsing">
						<h3>最近缴费</h3>
						<table width="450px" class="tablecss" border="0" cellspacing="0">
							<tr>
								<th width="35px">序列</th>
								<th width="79px">姓名</th>
								<th width="170px">毕业学校</th>
								<th width="170px">电话</th>
							</tr>
							<tr>
								<td>1</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>2</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>3</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>4</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>5</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>6</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>7</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>8</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>9</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td>10</td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</table>
					</div>
					<div class="pay-the-fees">
						<h3>数据浏览
							<ul id="dian">
								<li class="bbg"></li>
								<li class="bg"></li>
								<li class="bg"></li>
							</ul>
						</h3>
						<div class="tu" id="main" style="width: 700px;height:300px;"></div>
						<div class="tu" id="wire" style="width: 700px;height: 300px;"></div>
						<div class="tu" id="mainA" style="width: 700px;height: 300px;"></div>
					</div>
					<div class="newest">
						<h3>最新动态</h3>
						<div class="newestA">
							<p>一直以来, 量子矩阵OA就是整个OA界最神秘, 最强大的OA产品. 强大到什么程度呢? 开发者都说不上来...^_^O(∩_∩)O哈哈~
							</p>
							<p>喜报: 量子矩阵获得教育部高等教育司2019年度首批产学合作协同育人项目单位</p>
							<p>喜报: 量子矩阵获得教育部高等教育司2019年度首批产学合作协同育人项目单位</p>
							<p>喜报: 量子矩阵获得教育部高等教育司2019年度首批产学合作协同育人项目单位</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script src="Js/style.js">
	</script>
	<script type="text/javascript">
		// 基于准备好的dom，初始化echarts实例
		var myChart = echarts.init(document.getElementById('main'));
		var wireTa = echarts.init(document.getElementById('wire'));
		var myCharta = echarts.init(document.getElementById('mainA'));
		// 指定图表的配置项和数据
		var option = {
			title: {
				text: '年度月份报名量'
			},
			tooltip: {},
			legend: {
				data: []
			},
			xAxis: {
				data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月"]
			},
			yAxis: {},
			series: [{
				name: '报名量',
				type: 'bar',
				data: [5, 20, 36, 10, 10, 20, 24, 34, 17]
			}]
		};
		// 使用刚指定的配置项和数据显示图表。
		myChart.setOption(option);
		var option = {
			title: {
				text: '年度月份咨询量'
			},
			tooltip: {},
			legend: {
				data: []
			},
			xAxis: {
				type: 'category',
				data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月']
			},
			yAxis: {
				type: 'value'
			},
			series: [{
				data: [10, 9, 2, 4, 14, 20, 18, 22],
				type: 'line'
			}]
		};
		wireTa.setOption(option);
		var option = {
			title: {
				text: '年度月份退费量'
			},
			tooltip: {},
			legend: {
				data: []
			},
			xAxis: {
				data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月"]
			},
			yAxis: {},
			series: [{
				name: '退费量',
				type: 'bar',
				data: [2, 3, 10, 5, 3, 0, 1, 8, 7]
			}]
		};
		myCharta.setOption(option);
		$('#dian li').on('click', function() {
			$(this).addClass('bigbg').siblings().removeClass('bigbg')
			var index = $(this).index();
			$('.tu').eq(index).show().siblings('.tu').hide()
		})

		$('.body_left_list li').addClass('li')
		$('.body_left_list li').on('click', function() {
			$(this).addClass('bga').siblings().removeClass('bga')
		})
	</script>

</html>